<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="resources/snav-testharness.js"></script>

<style>
  div {
    width: 100px;
    height: 100px;
    margin: 5px;
    margin-top: 400px;
    border: 1px solid black;
  }
  span {
    position: absolute;
    left: 300px;
    overflow: hidden;
    width: 1px;
    height: 1px;
    clip: rect(1px 1px 1px 1px);
  }
</style>

<div id="first" tabindex="0"></div>
<a id="link" href="https://example.com">
  <!-- Because this span comes first in DOM order, but is positioned to the
  right of the text node below, some bounding box calculations return an empty
  rect. Make spatial-navigation behaves correctly in this case. -->
  <span>
    Invisible Text
  </span>
  Visible Text
</a>

<div id="offscreen" tabindex="0"></div>

<script>
  test(function(t) {
    assert_true(internals.runtimeFlags.keyboardFocusableScrollersEnabled);
  }, "Make sure KeyboardFocusableScrollers is set.");

  // This test checks that focusless mode allows entering focus into an element
  // with the enter key and exiting it with the escape key.
  const first = document.getElementById("first");
  const link = document.getElementById("link");

  snav.assertSnavEnabledAndTestable();

  test(() => {
    assert_equals(window.scrollY, 0, "Start at 0 scroll offset.")

    // Move interest onto the link.
    snav.triggerMove('Down');
    snav.triggerMove('Down');

    assert_equals(window.internals.interestedElement,
                  link,
                  "link should start off interested.");

    // Move interest down from the link. Since the bottom div is offscreen, we
    // should scroll down rather than moving interest. In particular, make sure
    // interest doesn't move back to the upper box.
    snav.triggerMove('Down');
    assert_greater_than(window.scrollY, 0, "Start at 0 scroll offset.")
    assert_not_equals(document.activeElement,
                      first,
                      "Interest must not move up.");
  }, "Clipped anchor doesn't caused looped-navigation bug.");
</script>
